<template>
	<view class="wrap">
		<view class="img_wrap">
			<image src="/static/img/success.png" mode="" v-if="status == 1"></image>
			<image src="/static/img/fail.png" mode="" v-else></image>
		</view>
		<view class="text">
			<text>{{title}}</text>
		</view>
		<view class="bottom">
			<view class="btn" v-if="status == 1" @click="handleClick">完成</view>
			<view class="btn back" v-else @click="handleClick">返回</view>
		</view>
	</view>
</template>

<script>
	export default {
		data () {
			return {
				status: '',
				title: '充值失败'
			}
		},
		onShow () {
			let options = uni.getEnterOptionsSync();
			if (options.scene == '1038' &&
				options.referrerInfo.appId == 'wxef277996acc166c3') {
				// 代表从收银台小程序返回
				let extraData = options.referrerInfo.extraData;
				console.log(extraData);
				if (!extraData) {
					// "当前通过物理按键返回，未接收到返参，建议自行查询交易结果";
					console.log(extraData, 11111);
				} else {
					if (extraData.code == 'success') {
						// "支付成功";
						this.status = 1
						this.title = '充值成功'
					} else if (extraData.code == 'cancel') {
						this.status = 2
						this.title = '充值取消'
					} else {
						this.status = 2
						this.title = '充值失败'
					}
				}
			}
		},
		methods: {
			handleClick () {
				uni.switchTab({
					url: '/pages/my/my'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 100rpx 24rpx 24rpx;
		box-sizing: border-box;
		
		.img_wrap {
			width: 280rpx;
			height: 280rpx;
			margin-bottom: 36rpx;
			
			image {
				width: 100%;
				height: 100%;
			}
		}
		
		.text {
			margin-bottom: 64rpx;
			
			text {
				font-size: 32rpx;
				font-weight: 600;
			}
		}
		
		.bottom {
			
			.btn {
				width: 60vw;
				height: 96rpx;
				line-height: 96rpx;
				text-align: center;
				font-size: 28rpx;
				border-radius: 48rpx;
				box-sizing: border-box;
				background-color: #EA504F;
				color: #fff;
			}
			
			.back {
				color: #000;
				border: 1rpx solid #D1C8C8;
				background-color: transparent;
			}
		}
	}
</style>